var classify = {
  typeId: '',
  init: function (option) {
    for (var attr in option) {
      this[attr] = option[attr]
    }
    this.getDetail()
    this.getList()
  },
  getDetail: function () {
    if (!this.typeId) return
    try {
      var data = getTypeDetailInfo(this.typeId)[0]
      var pictrue = data.typePicture[0].picPath10
      var bg = data.typePicture[0].picPath3
      console.log(bg);
      bg && this.renderBg(bg)
      this.width = data.picWidth
      this.height = data.picHeight
      this.detail = data[0]
      $('#main').append('<img id="title" src="' + pictrue + '" />')
    } catch (error) {
      console.log('classify getData error')      
    }
  },
  getList: function () {
    if (!this.typeId) return
    try {
      var data = getTypeListByTypeId({TYPEID: this.typeId}).TYPEs
      page.data.classify = data
      var html = ''
      for (var i = 0, l = data.length; i < l; i++) {
        var img = data[i].typePicture[0].picPath2;
        var width = data[i].picWidth;
        var height = data[i].picHeight;
        var distance = 96;
        var left = (i * (width+distance)) + 50;
        var style = 'width:' + width + 'px;height:' + height + 'px;left:' + left + 'px;'
        var className = 'oh border-radius item'
        html += '<div class="' + className + '" id="classify-' + i + '" style="' + style + '">'
        html += '<img src="' + img + '"/>'
        html += '</div>'
      }
      // var pictrue = data[0].typePicture[0].picPath3
      $('#classify').html(html)
    } catch (error) {
      
    }
  },
  renderBg: function (bg) {
    $('#main').css('background-image', 'url(' + bg + ')')
  }
}